<template>
	<el-dialog :visible.sync="editPointShow"  :close-on-click-modal="false" class="addAblityForm" @close="$emit('update:showEditpoint',false)"
	 width="70%" :show-close='false' :append-to-body='true'>
		<span slot="title" class="dialog-title">
		   编辑检测项目
			<el-button  size="mini" class="popupClose" @click="resetPointForm()">关闭</el-button>
		</span>
		<el-form label-width="110px" :inline="false" style="height:60px;margin-top:20px" class="demo-form-inline" ref="sampleForm">

			<el-form-item label="容器类型" style = "width:32%;display:inline-block">
				<el-col :span="22">
					<el-select v-model="editRowItem.bottleType" size="mini">
						<el-option v-for="item in bottleOptions" :key="item.id" :label="item.name" :value="item.id">
						</el-option>
					</el-select>
				</el-col>
			</el-form-item>
			<el-form-item label="采样体积(mL)" style = "width:32%;display:inline-block">
				<el-col :span="22">
					<el-input v-model="editRowItem.capacity"  size="mini" :min="0" :step="50" style = "width:100%;" class = "deal" oninput="this.value=this.value.replace(/[^0-9]+/,'');"></el-input>
				</el-col>
			</el-form-item>
			<el-form-item label="单独采样" style = "width:32%;display:inline-block">
				<el-col :span="22">
					<el-select v-model="editRowItem.doAlone" size="mini">
						<el-option v-for="item in yesorno" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</el-col>
			</el-form-item>
			<!--doAlone-->
		</el-form>



		<p v-if="isStatus == 0" style="color:red;margin-bottom:10px">提示：该能力参数已禁用,无法修改!</p>
		<el-table :data="itemBeanList" v-if="reload" ref="itemRef" @selection-change="handleReceivedChange" style="width: 100%;height:calc(100% - 80px)"
		 class="tableCon" size="mini">
			<el-table-column width="50" type="selection" :selectable='selectInit'></el-table-column>
			<el-table-column label="序号" min-width="45px">
				<template slot-scope="scope">
					{{scope.$index+1}}
				</template>
			</el-table-column>
			<el-table-column label="检测项目" prop="itemName" min-width="180px" show-overflow-tooltip>
			</el-table-column>
		</el-table>



		<span slot="footer" style="text-align: right;">
			    <el-button type="primary" @click="addSubmit" size="mini">确 定</el-button>
			    <el-button  size="mini" @click="resetPointForm()">取 消</el-button>
			  </span>
	</el-dialog>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		props: ['showEditpoint', 'editRowItem'],
		data() {
			return {
				itemBeanList: [],
				reload: true,
				multipleReceived: [],
				isStatus: 1,
				bottleType:"",
				capacity:"",
				abilityData:{},


			}
		},
		computed: {
			...mapState(['typeQcSelect', 'tableHeightF','bottleOptions','yesorno']),
			editPointShow: {
				get: function () {
					return this.showEditpoint
				},
				set: function (newValue) {

				}
			},
			tableHeightC(){
				return ((window.innerHeight - 300) / 2 - 5) //有上下两个表格
			}
		},
		mounted() {
			this.$store.dispatch('dogetDictionary')
			this.$store.dispatch("getAllBottles");
			console.log(this.bottleOptions)
		},
		methods: {
			// 能力参数选中的数据
			handleReceivedChange(val) {
				this.multipleReceived = val;

			},
			selectInit(row, index) { //判断样品列表是否可勾选 是qc样品不可勾选
				if (this.isStatus == 1) {
					return true  //可勾选
				} else {
					return false  //不可勾选
				}
			},
			getItemBean() {

				this.$http({
					method: 'post',
					apiUrl: '/technology/readDetectabilityAndItem.htm',
					params: { id: this.editRowItem.detectability },
					isJson: false,
				}).then(res => {
					if (res.code === 0) {
						this.isStatus = res.data.status;
						this.itemBeanList = res.data.itemBeanList;
						this.abilityData = res.data
						var that = this;
						// 遍历默认勾选
						res.data.itemBeanList.forEach(item => {
							this.editRowItem.itemBeans.forEach(row => {
								if (item.item == row.item) {
									setTimeout(() => {
										that.$refs.itemRef.toggleRowSelection(item)
									}, 100)
								}
							})
						})
					}

				})
			},
			// 改变检测项目之后修改
			addSubmit() {
				if (this.multipleReceived.length == 0) {
					this.$notify({
						title: "警告！",
						message: "至少选中一个检测项目！",
						type: "warning"
					})
				} else {
					// //判断是否修改
					// var update = false;
					// if (this.editRowItem.itemBeans.length == this.multipleReceived.length) {
					// 	for (var i in this.editRowItem.itemBeans) {//原本的
					// 		var flag = false;
					// 		for (var j in this.multipleReceived) {//最后选中的
					// 			if (this.editRowItem.itemBeans[i].item == this.multipleReceived.item) {
					// 				flag = true;
					// 			}
					// 		}
					// 		if (!flag) {
					// 			update = true;
					// 			break;
					// 		}
					// 	}
					// } else {
					// 	update = true;
					// }

          console.log(this.$parent.sampleObj)
          // 选中的行的检测项目
          this.editRowItem.itemBeans = this.multipleReceived;
          this.editRowItem.itemNames = this.multipleReceived.map(item => item.itemName).join('、')

          // 选中的行的子样的检测项目
					for (let i in this.$parent.getPlanData.sampleBeans) {
            var sampleObj = this.$parent.getPlanData.sampleBeans[i];
            console.log(sampleObj,this.$parent.sampleObj)
            if(sampleObj.parent!= undefined && sampleObj.parent!= "" && sampleObj.parent!= null && sampleObj.parent == this.$parent.sampleObj.parent){
              if(sampleObj.qcType != undefined && sampleObj.qcType != null && sampleObj.qcType != ""){

                for (let k in this.$parent.getPlanData.sampleBeans[i].detectBeans) {

                	var obj = this.$parent.getPlanData.sampleBeans[i].detectBeans[k];
                	if (obj.detectability == this.editRowItem.detectability) {
                		obj.itemBeans = this.multipleReceived;
                		// if (update) {
                		// 	this.editRowItem.updateFlag = 221; //2代表修改，2代表能力参数，1代表修改的检测项目
                		// }
                		var itemNames = [];
                		for (var m in obj.itemBeans) {
                			itemNames.push(obj.itemBeans[m].itemName)
                		}
                		obj.itemNames = itemNames.join('、')
                	}
                }
              }
            }

					}
					this.resetPointForm();
				}

			},

			resetPointForm() {
				this.$emit('update:showEditpoint', false)
				this.$parent.editRowItem = {};
			},
		},
		watch: {
			editPointShow(val) {
				if (val) {
					this.getItemBean();
					console.log(this.editRowItem)
					if(this.editRowItem.capacity == undefined || this.editRowItem.capacity == '' || this.editRowItem.capacity == null ){
						this.editRowItem.capacity = 100;
					}

				}
			},
			paramsItemList: {
				handler(newName, oldName) {

					this.DetectArr = [];
					for (let i = 0; i < newName.length; i++) {
						this.DetectArr.push(this.DetectList)
					}

				},
				deep: true
			},
			changeFlag(val) {
				if (this.abilityBeanList.length != 0) {
					this.$refs.abilityRef.setCurrentRow(this.abilityBeanList[0])
					this.clickAbility(this.abilityBeanListAll[0], { label: "序号" })


				} else {
					this.itemBeanList = []
				}
			},
			abilityBeanList: {
				deep: true,
				handler(val, oldVal) {
					var flag = 1;
					if (this.abilityBeanList.length != 0) {
						for (var i in this.abilityBeanList) {
							if (this.abilityBeanList[i].checked) {
								flag = flag * 1
							} else {
								flag = flag * 0
							}
						}
						if (flag) {
							this.allChecked = true;
						} else {
							this.allChecked = false;
						}
					}

				}
			}
		}
	}

</script>

<style>
	.addAblityForm .el-dialog {
		height: 70%;
	}

	.addAblityForm .el-dialog .el-dialog__body {
		height: calc(100% - 85px);
		padding: 10px;
	}

	.addAblityForm .tableCon .el-table__fixed-body-wrapper,
	.addAblityForm .tableCon .el-table__body-wrapper {
		height: calc(100% - 46px);
	}

	.addAblityForm .tablemiddle {
		position: absolute;
		left: calc(30% - 15px);
		top: 36%;
		font-size: 30px;
		width: 10%;
		text-align: center;
	}
</style>
